'use strict';



import React, { Component } from 'react';

import {
	View,
	Image,
	ImageBackground,
	Dimensions,
	TouchableWithoutFeedback,
	StyleSheet,
	Text,
	TouchableOpacity,
	TextInput,
	ScrollView,
	TouchableHighlight,
	TouchableNativeFeedback,
	Switch,
	Modal,
	Alert
} from 'react-native';

import ToastUtil from '../../../../core/utils/toast-util.js';
import { Loading, EasyLoading } from 'react-native-easy-loading';

import DatePicker from 'react-native-datepicker'
import Hr from 'react-native-hr'
import Color from '../../../../core/constant/color.js';


import Constant from '../../../../core/constant/constant';

import CameraButton from '../../../../core/component/comp.button-camera.js';

import Toolbar from '../../../../core/component/comp.toolbar';


import InitDB from '../../../../core/database/init-db.js';

import ModalDropdown from '../../../../core/component/comp.modal-dropdown.js';
import { NavigationActions } from 'react-navigation'







let winWidth = Dimensions.get('window').width;//屏幕宽度

let winHeight = Dimensions.get('window').height;//屏幕高度




let headImgEmpty = require('../../../../img/headImg_empty.png');
import Http from '../../../../core/utils/http.js';




const BORDER_COLOR_NORMAL = '#DDD';

const BORDER_COLOR_RED = '#ff0000';

const BUTTON_BGCOLOR_ENABLE = '#FFC000';

const BUTTON_BGCOLOR_DISABLE = '#FFC000';

const BUTTON_COLOR_ENABLE = '#FFFFFF';

const BUTTON_COLOR_DISABLE = '#FFC000';

let instance;

class AccountSafeScene extends React.Component {
	// 构造
	constructor(props) {
		super(props);




		this.state = {
			yanzhengma: null,
			modalVisible: '0',

		}




		this.goBack.bind(this);
		this.submit_.bind(this);
		this.reSendYzm_select.bind(this);
		instance = this;

	}





	componentDidMount() {

		let username = InitDB.getUserInfo('QST_CODE="username"')[0].OPT_VAL;
		this.setState({
			username: username
		})




	}




	sendMessageConfirm() {

		if (this.state.xiayibuEnable) {


			Alert.alert(
				'确认手机号码',
				'我们将发送验证码短信到这个号码:+86' + this.state.username_new,
				[
					{ text: '取消', onPress: () => console.log('Cancel Pressed'), style: 'cancel' },
					{ text: '好', onPress: () => this.sendMessage() },
				],
				{ cancelable: false }
			)



		}

	}

	sendMessage() {



		let params = {
			mobile: this.state.username,
		};

		Promise.resolve().then(EasyLoading.show('loading...', 5000));
		

		Http.post_upload('sendVerification', null, params)
			.then(res => {

				Promise.resolve().then(EasyLoading.dismis());
				

				if (res.returnType.resultCode === '1') {


					ToastUtil.show("验证码发送成功");

					
					//this.setState({bgYanzhengma:res.returnType.other.yanzhengma,sendYanzhengmaDate:new Date()});


				} else {
					ToastUtil.show('验证码发送失败' + res.returnType.resultMessage);


				}


			}).catch(err => {
				Promise.resolve().then(EasyLoading.dismis());
				
				//请求失败
				ToastUtil.show('发送失败，错误信息:' + err);



			})

	}

	goBack() {

		Alert.alert("", "验证码可能略有延迟，确定返回并重新开始?",
			[
				{ text: '等待', onPress: () => console.log('Cancel Pressed'), style: 'cancel' },
				{ text: '返回', onPress: () => instance.props.navigation.goBack() },
			],
			{ cancelable: false }
		)
	}




	submit_() {
		if (!this.state.yanzhengma) {
			return;
		}

		if (this.state.yanzhengma === instance.props.navigation.state.params.yanzhengma) {


			let params = { username: instance.props.navigation.state.params.username_new }

			Http.post_upload('updateUserName', InitDB.getCurrentUser().empId, params)
				.then(res => {


					if (res.returnType.resultCode === '1') {




						ToastUtil.show("更改成功");

						InitDB.updateUserName(instance.props.navigation.state.params.username_new);

						Promise.resolve().then(EasyLoading.dismis());


						const resetAction = NavigationActions.reset({
							index: 0,
							actions: [
								NavigationActions.navigate({ routeName: 'Home' })
							]
						})
						instance.props.navigation.dispatch(resetAction)





					} else {
						Promise.resolve().then(EasyLoading.dismis());

						ToastUtil.show('验证码发送失败' + res.returnType.resultMessage);


					}


				}).catch(err => {
					//请求失败
					ToastUtil.show('发送失败，错误信息:' + err);
					Promise.resolve().then(EasyLoading.dismis());




				})




		}

	}




	reSendYzm_select(value) {

		instance.setState({ modalVisible: '0' });

		if (value === '重新获取验证码') {
			sendMessage();

		}

	}


	render() {
		return (



			<View>




				<Toolbar
					navigation={instance.props.navigation}
					needBack={true}
					goBack={this.goBack}
					text={'填写验证码'} />





				<ScrollView style={styles.body}>
					<Loading />
					<View style={{
						marginLeft: 15, marginRight: 15, marginTop: 10, marginBottom: 10, flexDirection: "row",
						justifyContent: "center"
					}}>
						<Text style={{ color: Color.TEXT_GREY, fontSize: 15 }}>短信验证码已发送，请填写验证码</Text>
					</View>




					<View style={{
						marginLeft: 15, marginRight: 15, marginTop: 15, marginBottom: 0, flexDirection: "row",
						justifyContent: "center", backgroundColor: "#ffffff", borderBottomWidth: 1, borderColor: Color.TEXTINPUT_LINE, padding: 8
					}}>
						<View style={{ flex: 1, }}><Text style={styles.text_grey}>手机号</Text></View>
						<View style={{ flex: 3, }}><Text style={styles.text_grey}>+86 {instance.props.navigation.state.params.username_new}</Text></View>
					</View>

					<View style={{
						marginLeft: 15, marginRight: 15, marginTop: 0, marginBottom: 10, flexDirection: "row",
						justifyContent: "center", backgroundColor: "#ffffff", borderBottomWidth: 1, borderColor: Color.TEXTINPUT_LINE, padding: 8
					}}>
						<View style={{ flex: 1, }}><Text>验证码</Text></View>
						<View style={{ flex: 3, }}><TextInput placeholder="请输入验证码" onChangeText={(text) => this.setState({ yanzhengma: text })} /></View>
					</View>


					<TouchableHighlight style={{
						marginLeft: 15, marginRight: 15, marginTop: 0, marginBottom: 10, flexDirection: "row",
						justifyContent: "center", backgroundColor: this.state.yanzhengma ? Color.BTN_BGCOLOR : Color.BTN_DISABLE_BGCOLOR, borderBottomWidth: 1, borderColor: Color.TEXTINPUT_LINE, padding: 8
					}}
						onPress={this.submit_.bind(this)}>

						<Text style={{ color: this.state.yanzhengma ? Color.BTN_TEXT : Color.BTN_DISABLE_TEXT }}>提交</Text>

					</TouchableHighlight>


					<TouchableHighlight style={{
						flexDirection: "row",
						justifyContent: "center",
					}}
						onPress={() => { instance.setState({ modalVisible: '1' }) }}>

						<View><Text style={styles.reSendYzm_text}>收不到验证码?</Text></View>

					</TouchableHighlight>
					<ModalDropdown modalVisible={this.state.modalVisible} data={['重新获取验证码']} clickEvent={this.reSendYzm_select} />

















				</ScrollView>

			</View>




		)
		//}




	}

}



const styles = StyleSheet.create({
	body: {
		backgroundColor: Color.VIEW_BG_COLOR,
		height: winHeight,
		flexDirection: "column",

	},

	box: {
		height: 50,
		justifyContent: 'center',
		alignItems: 'center',
		borderBottomWidth: 0.5,
		borderColor: '#DDDDDD',
		backgroundColor: '#38373d',
		flexDirection: 'row',
		marginTop: 0,
		width: winWidth,
		//	flex:1,
	},
	back: {
		height: 20,
		width: 20,

	},
	text: {
		alignSelf: "center",
		color: '#ffffff'
		//marginLeft:winWidth/2-20,
	},
	text_grey: {
		color: Color.TEXT_GREY
	},
	reSendYzm_text: {
		color: Color.TEXT_HREF,
		fontSize: 14,
		alignSelf: "center",

	}

});

module.exports = AccountSafeScene;